<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link href="../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet" />
		<script src="../js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			html,
			body,
			.container {
				height: 100%;
				width: 100%;
				margin: 0;
				padding: 0;
			}

			.top {
				width: 100%;
				height: 80px;
				background: url(../img/Snipaste_2020-08-25_16-41-00.png);
			}

			.right {
				position: relative;
				width: 80%;
				height: 80%;
				top: -254px;
				left: 265px;
			}
			form{
				position: relative;
				left: 420px;
			}
		</style>
	</head>
	<body>
		<div class="container">
			<div class="top">
				<span style="font-size: 30px;position: relative;top:20px;left: 40px;">宿舍管理系统</span>
				<span style="font-size: 15px; position: relative; top:35px; left: 1000px;">当前用户:</span>
			</div>

			<div class="list-group" style="width: 15%; position: relative;top:55px;left: 20px;">
				<a href="index01.html" class="list-group-item active">
					首页
				</a>
				<a href="ssg.html" class="list-group-item">宿舍管理员管理</a>
				<a href="xs.html" class="list-group-item">学生管理</a>
				<a href="ssl.html" class="list-group-item">宿舍楼管理</a>
				<a href="qq.html" class="list-group-item">缺勤记录</a>
				<a href="../login.html" class="list-group-item">退出系统</a>
			</div>
			<div class="right">
				<h4><strong>学生管理</strong></h4>
				<form id="form">
					<input type="text" name="number" placeholder="学号" /></br>
					<input type="text" name="name" placeholder="姓名"/></br>
					<input type="text" name="sex" placeholder="性别" /></br>
					<input type="text" name="dorm" placeholder="宿舍楼" /></br>
					<input type="text" name="qinshi" placeholder="寝室" /></br>
					<input type="text" name="phone" placeholder="电话" /></br>
					<button type="button" onclick="save()" class="btn btn-primary" style="margin-left: 65px;margin-top: 10px;">保存</button>
				</form>
				<script src="../js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
				<script type="text/javascript">
					
					let editItem = JSON.parse(sessionStorage.getItem("item"));
					console.log(editItem);
					if(editItem) {
						$("input[name='number']").val(editItem.number);
						$("input[name='name']").val(editItem.name);
						$("input[name='sex']").val(editItem.sex);
						$("input[name='dorm']").val(editItem.dorm);
						$("input[name='qinshi']").val(editItem.qinshi);
						$("input[name='phone']").val(editItem.phone);
					}
					function maxId(arr) {
						console.log(typeof arr);
						if(arr instanceof Array) {
							if(arr.length === 0) {
								return;
							}
							let max = arr[0];
							for(let item of arr) {
								if(max.number < item.number) {
									max = item;
								}
							}
							
							return max.number;
						}
					}
					function save() {
						let number = $("input[name='number']").val();
						let name = $("input[name='name']").val();
						let sex = $("input[name='sex']").val();
						let dorm = $("input[name='dorm']").val();
						let qinshi = $("input[name='qinshi']").val();
						let phone = $("input[name='phone']").val();
						let obj = {
							number: number,
							name: name,
							sex: sex,
							dorm: dorm,
							qinshi:qinshi,
							phone:phone
						}
				
						let data01 = localStorage.getItem("data01");
							if(data01) {
								data01 = JSON.parse(data01);
								for(let index in data01) {
									let item = data01[index];
									
								}
								if(editItem) {
									let index = sessionStorage.getItem("index");
									data01.splice(index, 1, obj)
								}else {
									obj.id = maxId(data01) + 1;
									data01.push(obj);//添加
								}
								localStorage.setItem("data01", JSON.stringify(data01));
								location.href = 'xs.html';
							}
						}
				</script>
			</div>
	</body>
</html>
